<div class="layuimini-container layuimini-page-anim">
    <div class="layuimini-main">
        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">部门</label>
                            <div class="layui-input-inline">
                                <select name="rsbMonDep" id="rsbMonDep"  lay-filter="dep">
                                    <option></option>
                                    <option value="人事部">人事部</option>
                                    <option value="销售部">销售部</option>
                                    <option value="生产部">生产部</option>
                                    <option value="财务部">财务部</option>
                                    <option value="研发部">研发部</option>
                                    <option value="物资部">物资部</option>
                                    <option value="无">无</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">职位</label>
                            <div class="layui-input-inline">
                                <select name="rsbMonPost" id="rsbMonPost"
                                        lay-filter="post">

                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button type="submit" class="layui-btn layui-btn-primary" lay-submit
                                 id="searchs"   lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索
                            </button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>

        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">
                <button style="width: 10%" class="layui-btn layui-btn-fluid layui-btn-sm data-add-btn" lay-event="add"> 添加</button>
            </div>
        </script>

        <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>

        <script type="text/html" id="currentTableBar">
            <a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="edit">编辑</a>
            <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
        </script>

    </div>
</div>
<script>
    $(function () {
        layui.use(['form', 'table', 'miniPage', 'element'], function () {
            var $ = layui.jquery,
                form = layui.form,
                table = layui.table,
                miniPage = layui.miniPage;


            table.render({
                elem: '#currentTableId',
                url: '/rsb/showMoney',
                toolbar: '#toolbarDemo',
                defaultToolbar: ['filter', 'exports', 'print', {
                    title: '提示',
                    layEvent: 'LAYTABLE_TIPS',
                    icon: 'layui-icon-tips'
                }],
                cols: [[
                    {field: 'rsbMonNum', width: 80, title: '编号'},
                    {field: 'rsbMonDep', width: 80, title: '部门'},
                    {field: 'rsbMonPost', width: 110, title: '职位'},
                    {field: 'rsbMonBasepay', width: 135, title: '基本工资', sort: true},
                    {field: 'rsbMonAdd', width: 100, title: '加班费', sort: true},
                    {field: 'rsbMonEat', width: 100, title: '餐补费', sort: true},
                    {field: 'rsbMonTraffic', width: 135, title: '交通补贴', sort: true},
                    {field: 'rsbMonLate', width: 135, title: '迟到早退', sort: true},
                    {field: 'rsbMonNocome', width: 80, title: '缺勤', sort: true},
                    {field: 'rsbMonPhone', width: 135, title: '通讯补贴', sort: true},
                    {field: 'rsbMonFive', width: 110, title: '五险一金', sort: true},
                    {title: '操作', minWidth: 130, toolbar: '#currentTableBar', align: "center"}
                ]],
                limits: [  8, 10, 15],
                limit: 8,
                page: true,
                skin: 'line'
            });

            // 监听搜索操作
            form.on('submit(data-search-btn)', function (data) {
                var result = JSON.stringify(data.field);
                //执行搜索重载
                table.reload('currentTableId', {
                    page: {
                        curr: 1
                    }
                    , where: {
                        condition: result
                    },
                    url:"/rsb/searchMoney",
                    method:"post"
                });
                return false;
            });


            /**
             * toolbar事件监听
             */
            table.on('toolbar(currentTableFilter)', function (obj) {
                if (obj.event === 'add') {   // 监听添加操作
                    var content = miniPage.getHrefContent('page/rsb/addmoney.html');
                    var openWH = miniPage.getOpenWidthHeight();

                    var index = layer.open({
                        title: '添加用户',
                        type: 1,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: true,
                        area: [openWH[0] + 'px', openWH[1] + 'px'],
                        offset: [openWH[2] + 'px', openWH[3] + 'px'],
                        content: content,
                    });
                    $(window).on("resize", function () {
                        layer.full(index);
                    });
                }
            });

            //监听表格复选框选择
            table.on('checkbox(currentTableFilter)', function (obj) {
                console.log(obj)
            });

            table.on('tool(currentTableFilter)', function (obj) {
                var data = obj.data;
                if (obj.event === 'edit') {
                    var content = miniPage.getHrefContent('page/rsb/addmoney.html');
                    var openWH = miniPage.getOpenWidthHeight();
                    var index = layer.open({
                        title: '编辑用户',
                        type: 1,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: true,
                        area: [openWH[0] + 'px', openWH[1] + 'px'],
                        offset: [openWH[2] + 'px', openWH[3] + 'px'],
                        content: content,
                        success: function (layero,index) {
                            if (data != null) {
                                $("#rsbMonNum").val(data.rsbMonNum);
                                $('#rsbMonDep option').each(function () {
                                    if ($(this).val() == (data.rsbMonDep)) {
                                        $(this).attr("selected", true);
                                    }
                                });
                                $("#rsbMonPost2").append("<option value='" + data.rsbMonPost + "' selected>" + data.rsbMonPost + "</option>");
                                $("#rsbMonBasepay").val(data.rsbMonBasepay);
                                $("#rsbMonAdd").val(data.rsbMonAdd);
                                $("#rsbMonEat").val(data.rsbMonEat);
                                $("#rsbMonTraffic").val(data.rsbMonTraffic);
                                $("#rsbMonLate").val(data.rsbMonLate);
                                $("#rsbMonNocome").val(data.rsbMonNocome);
                                $("#rsbMonPhone").val(data.rsbMonPhone);
                                $("#rsbMonFive").val(data.rsbMonFive);
                            }
                            layui.form.render("select");
                        }
                    });
                    $(window).on("resize", function () {
                        layer.full(index);
                    });
                    return false;
                } else if (obj.event === 'delete') {
                    var num=data.rsbMonNum;
                    layer.confirm('真的删除编号'+num+'吗？',{btn:['是的,我确定','我再想想']}, function (index) {
                        /*obj.del();
                        layer.close(index);*/
                        $.ajax({
                            url:"/rsb/deleteMoney",
                            dataType:'json',
                            data:{
                                rsbMoneyNum:num
                            }
                        })
                        obj.del();
                        layer.close(index);
                    });
                }
            });

        });


        layui.use(['form', 'layedit', 'laydate'], function () {
            var form = layui.form
                , layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate;

            /**
             * 初始化表单，要加上，不然刷新部分组件可能会不加载
             */
            form.render();

            //日期
            laydate.render({
                elem: '#date'
            });
            laydate.render({
                elem: '#date1'
            });

            //创建一个编辑器
            var editIndex = layedit.build('LAY_demo_editor');

            //自定义验证规则
            form.verify({
                title: function (value) {
                    if (value.length < 5) {
                        return '标题至少得5个字符啊';
                    }
                }
                , pass: [
                    /^[\S]{6,12}$/
                    , '密码必须6到12位，且不能出现空格'
                ]
                , content: function (value) {
                    layedit.sync(editIndex);
                }
            });

            //监听指定开关
            form.on('switch(switchTest)', function (data) {
                layer.msg('开关checked：' + (this.checked ? 'true' : 'false'), {
                    offset: '6px'
                });
                layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅仅是ON|OFF', data.othis)
            });

            //监听提交
            form.on('submit(demo1)', function (data) {
                layer.alert(JSON.stringify(data.field), {
                    title: '最终的提交信息'
                })
                return false;
            });

            //表单初始赋值
            form.val('example', {
                "username": "贤心" // "name": "value"
                , "password": "123456"
                , "interest": 1
                , "like[write]": true //复选框选中状态
                , "close": true //开关状态
                , "sex": "女"
                , "desc": "我爱 layui"
            })

            form.on('select(dep)', function (data) {
                var url = "/showPost?dep=" + data.value;
                $.get(url, function (data) {
                    var tmp = '<option value="">请选择</option>';
                    for (var i in data) {
                        tmp += '<option value="' + data[i] + '">' + data[i] + '</option>';
                    }
                    $("#rsbMonPost").html(tmp);
                    //重载select模块，否则不会展示
                    layui.form.render("select");
                });
            })
        });
    })
</script>
